<template>
  <div>
    <div class="title-gra authorityDiv">
      <span style="color:#0090ff">用户资源目录权限</span>
      <span class="right">
        <i :class="mlflag ? 'el-icon-arrow-down' : 'el-icon-arrow-up'" @click="mlflagOpen"></i>
      </span>
      <!-- <div class="grab gra-r"></div> -->
    </div>
    <div v-show="mlflag" id="mlflag">
      <el-tree
        :props="defaultProps"
        :data="treeData"
        :default-expand-all="true"
        node-key="id"
        ref="tree"
        @check-change="handleCheckChange"
        @node-click="handleNodeClick"
        :class="view ? 'viewcheckbox' : ''"
      ></el-tree>
    </div>
  </div>
</template>

<script>
import {
  dataauthorityAuthority,
  getDataArea,
  getDataAreaTable,
  getAreaTableTB,
  saveResourceAuthority,
  getResourceAuthority
} from "@/api/authority.js";
import { deteleObject } from "@/filters/index.js";
export default {
  name: "TabDataType",
  data() {
    return {
      mlflag: true,
      treeData: [],
      defaultProps: {
        children: "children",
        label: "label"
      },
      defaultCheck: [],
      loading: false
    };
  },
  props: ["view", "roleId"],
  methods: {
    handleNodeClick(val) {},
    handleCheckChange(val) {},
    mlflagOpen() {
      this.mlflag = !this.mlflag;
    },
    treeDataHandel(data, dataList) {
      data.forEach((v,i) => {
        dataList.forEach(val => {
          let value = [];
          if (v._id == val.parentId && v._id != val.resourceId) {
            let map = {
              label: val.resourceName,
              children: [],
              id: val.resourceId+val.parentId,
              _id: val.resourceId,
              parentId: val.id,
              disabled: true
            };
            if (val.flag == 1) {
              this.defaultCheck.push(map.id);
            }
            v.children.push(map);
            value.push(map);
            if (v.children.length > 0) {
              this.treeDataHandel(value, dataList);
            }
          }
        });
      });
      return data;
    },
    //根据角色获取对应的资源目录权限
    getResourceAuthority() {
      this.treeData = [];
      let data = [];
      getResourceAuthority(this.roleId).then(res => {
        let dataList = res.data;
        if (res.success) {
          res.data.forEach(val1 => {
            let map = {
              label: "",
              children: [],
              id: "",
              _id: "",
              parentId: "",
              disabled: true
            };
            res.data.forEach(val2 => {
              if (
                val1.parentId == val2.resourceId &&
                val1.resourceId == val2.parentId
              ) {
                map.label = val2.resourceName;
                map.id = val2.resourceId + val2.parentId;
                map.parentId = val2.parentId;
                map._id = val2.resourceId;
                data.push(map);
              }
            });
          });
          data = this.treeDataHandel(data, dataList);
          this.treeData = data;
        }
      });
    }
  }
};
</script>
<style>
#mlflag>div{
  width: 100%;
}
.viewcheckbox .el-tree-node__content {
  color: #C0C4CC !important;
  cursor: not-allowed !important;
}
.viewcheckbox .el-checkbox__inner {
  background-color: #e4e7ed !important;
  border-color: #e4e7ed !important;
}
</style>
